<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>车辆列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="resources/layui/css/main.css" media="all" />
    <link rel="stylesheet" href="resources/layui/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="resources/layui/css/public.css" media="all" />
</head>
<body class="childrenBody">
<script type="text/javascript" src="resources/layui/layui/layui.js"></script>
<script th:inline="none">
    layui.use(['form','layer','laydate','table','laytpl','upload'],function() {
        var form = layui.form
        layer = parent.layer === undefined ? layui.layer : top.layer,
            $ = layui.jquery,
            laydate = layui.laydate,
            laytpl = layui.laytpl,
            table = layui.table,
            upload=layui.upload;
        var ids=$("#id").val();
        var pic45='noimg.jpg';
        var picBack='noimg.jpg';
        var picPos='noimg.jpg';
        var img45;
        var imgPos;
        var imgBack;
        $.ajax({
            url:'/car/carPic/'+ids,
            success:function (data) {
                for(i=0;i<data.length;i++){
                    if(data[i].des=='45'){
                        pic45=data[i].img_path;
                    }
                    if(data[i].des=='Back'){
                        picBack=data[i].img_path;
                    }
                    if(data[i].des=='Pos'){
                        picPos=data[i].img_path;
                    }
                }
                img45='<img src="showImage?imageFileName='+pic45+'" width="100%" height="100%"/>';
                imgBack='<img src="showImage?imageFileName='+picBack+'" width="100%" height="100%"/>';
                imgPos='<img src="showImage?imageFileName=/'+picPos+'" width="100%" height="100%"/>';
                $("#img45").append(img45);
                $("#imgBack").append(imgBack);
                $("#imgPos").append(imgPos);
            }
        });

        //取消
        $("#esc").click(function () {
            var index1=parent.layer.getFrameIndex(window.name)
            parent.layer.close(index1);
        });

        $("#button45").click(function () {
            pic45='noimg.jpg';
            img45='<img src="showImage?imageFileName='+pic45+'" width="100%" height="100%"/>';
            $("#img45").empty();
            $("#img45").append(img45);
        });
        $("#buttonPos").click(function () {
            picPos='noimg.jpg';
            imgPos='<img src="showImage?imageFileName='+picPos+'" width="100%" height="100%"/>';
            $("#imgPos").empty();
            $("#imgPos").append(imgPos);
        });
        $("#buttonBack").click(function () {
            picBack='noimg.jpg';
            imgBack='<img src="showImage?imageFileName='+picBack+'" width="100%" height="100%"/>';
            $("#imgBack").empty();
            $("#imgBack").append(imgBack);
        });
        //执行实例
        var uploadInst = upload.render({
            elem: '#test1' //绑定元素
            ,url: '/uploadImage2.do/' //上传接口,
            ,field:"headImage" //指定文件域名
            ,done: function(res){
                layer.msg(res.msg);
                pic45=res.data;
                img45='<img src="showImage?imageFileName='+res.data+'" width="100%" height="100%"/>';
                $("#img45").empty();
                $("#img45").append(img45);
            }
            ,error: function(){
                //请求异常回调
            }
        });
        var uploadInst = upload.render({
            elem: '#test2' //绑定元素
            ,url: '/uploadImage2.do/' //上传接口,
            ,field:"headImage" //指定文件域名
            ,done: function(res){
                layer.msg(res.msg);
                picPos=res.data;
                imgPos='<img src="showImage?imageFileName='+res.data+'" width="100%" height="100%"/>';
                $("#imgPos").empty();
                $("#imgPos").append(imgPos);
            }
            ,error: function(){
                //请求异常回调
            }
        });
        var uploadInst = upload.render({
            elem: '#test3' //绑定元素
            ,url: '/uploadImage2.do/' //上传接口,
            ,field:"headImage" //指定文件域名
            ,done: function(res){
                layer.msg(res.msg);
                picBack=res.data;
                imgBack='<img src="showImage?imageFileName='+res.data+'" width="100%" height="100%"/>';
                $("#imgBack").empty();
                $("#imgBack").append(imgBack);
            }
            ,error: function(){
                //请求异常回调
            }
        });

        form.on("submit(addFiles_btn)",function (data) {
            var index = top.layer.msg('数据提交中，请稍候',{icon: 16,time:false,shade:0.8});
            //实际使用时的提交数据
            //var params='[{"cid"='+ids+',"des":"45","img_path":"'+pic45+'"},{"cid"='+ids+',"des":"Pos","img_path":"'+picPos+'"},{"cid"='+ids+',"des":"Back","img_path":"'+picBack+'"}]'
            var des="45,Pos,Back";
            var img_path=pic45+","+picPos+","+picBack;
            //console.log(params)
            $.post("carPic.do?cid="+ids+"&des="+des+"&img_path="+img_path,function (res) {
                console.log(res.code);
                if(res.code==3013){
                    top.layer.close(index);
                    top.layer.msg(res.msg);
                    var index1=parent.layer.getFrameIndex(window.name)
                    parent.layer.close(index1);
                    parent.location.reload();
                }else if(res.code=-3013){
                    layer.msg(res.msg);
                }
            },"json");
            return false;
        });
    });

</script>
<form class="layui-form" style="width:100%;" id="dataFrm">
    <input id="id" name="id" type="hidden">
<div class="content content-nav-base commodity-content">
    <div class="commod-cont-wrap">
        <div class="commod-cont w1200 layui-clear">
            <div class="right-cont-wrap">
                <div class="right-cont">
                    <div class="cont-list layui-clear" id="list-cont">
                        <div class="item" style='width:300px;float:left;margin: 10px'>
                            <div id="img45" class="img45">
                            </div>
                            <div class="text">
                                <p class="title" align="center">侧面</p>
                                <p class="delete" align="r" >
                                <form class="layui-form"  align="center">
                                    <button type="button" class="layui-btn" id="test1">
                                        <i class="layui-icon">&#xe67c;</i>上传图片
                                    </button>
                                    <button id="button45" type="button" class="layui-btn layui-btn-danger"><i class="layui-icon"></i></button>
                                </form>
                                </p>
                            </div>
                        </div>
                        <div class="item" style='width:300px;float:left;margin: 10px'>
                            <div id="imgPos" class="picPos">
                            </div>
                            <div class="text">
                                <p class="title" align="center">正面</p>
                                <p class="delete" align="r">
                                <form class="layui-form"  align="center">
                                    <button type="button" class="layui-btn" id="test2">
                                        <i class="layui-icon">&#xe67c;</i>上传图片
                                    </button>
                                    <button id="buttonPos" type="button" class="layui-btn layui-btn-danger"><i class="layui-icon"></i></button>
                                </form>
                                </p>
                            </div>
                        </div>
                        <div class="item" style='width:300px;float:left;margin: 10px'>
                            <div id="imgBack" class="picBack">

                            </div>
                            <div class="text">
                                <p class="title" align="center">背面</p>
                                <p class="delete" align="r">
                                <form class="layui-form"  align="center">
                                    <button type="button" class="layui-btn" id="test3">
                                        <i class="layui-icon">&#xe67c;</i>上传图片
                                    </button>
                                    <button id="buttonBack" type="button" class="layui-btn layui-btn-danger"><i class="layui-icon"></i></button>
                                </form>
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
    <div style="margin-top: 50px" align="center">
    <div class="layui-inline">
        <button id="addFiles_btn" class="layui-btn layui-btn-normal" lay-submit="" lay-filter="addFiles_btn">保存</button>
    </div>
    <div class="layui-inline" style="margin-left: 20px">
        <button id="esc" class="layui-btn layui-btn-danger" lay-submit="" lay-filter="delAll_btn">取消</button>
    </div>
    </div>
</form>
    <!--<form class="layui-form"  align="center">-->

    <!--</form>-->

<!--<div class="layui-form-item layui-row layui-col-xs12">-->
    <!--<label class="layui-form-label">上传图像:</label>-->
    <!--<div class="layui-input-block">-->
        <!--<button type="button" class="layui-btn" id="test">-->
            <!--<i class="layui-icon">&#xe67c;</i>上传图片-->
        <!--</button>-->
        <!--<input type="hidden" id="himg" name="headimg">-->
        <!--<div class="layui-upload-list">-->
            <!--<img class="layui-upload-img" id="demo1" src="resources/images/nopic.jpg" width="200px" height="200px">-->
            <!--<p id="demoText"></p>-->
        <!--</div>-->
    <!--</div>-->
<!--</div>-->

</body>
</html>